import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

//Widget管理自身状态
class TapboxA extends StatefulWidget {
  TapboxA({Key key}) : super(key: key);

  @override
  State<StatefulWidget> createState() => _TapboxAState();
}

class _TapboxAState extends State {
  bool _active = false;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () => setState(() => _active = !_active),
      child: Container(
        child: Text(_active ? "active" : "inactivie"),
        decoration: BoxDecoration(
            color: _active ? Colors.lightGreen[700] : Colors.grey[600]),
      ),
    );
  }
}

/////父Widget管理子Widget的状态

class ParentWidget extends StatefulWidget {
  ParentWidget({Key key}) : super(key: key);

  @override
  State<StatefulWidget> createState() => _ParentState();
}

class _ParentState extends State {
  bool _active = false;

  @override
  Widget build(BuildContext context) {
    return Container(
      child: TapboxC(
        active: _active,
        onChanged: (newState) => setState(() => _active = newState),
      ),
    );
  }
}

class TapboxB extends StatelessWidget {
  final bool active;

  final ValueChanged<bool> onChanged;

   TapboxB({Key key, this.active: false, @required this.onChanged})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: ()=>onChanged(!active),
      child: Container(
        child: Text(active ? "active" : "inactivie"),
        decoration: BoxDecoration(
            color: active ? Colors.lightGreen[700] : Colors.grey[600]),
      ),
    );
  }
}

class TapboxC extends StatefulWidget {

  final bool active;

  final ValueChanged<bool> onChanged;

  TapboxC({Key key, this.active: false, @required this.onChanged})
      : super(key: key);


  @override
  State<StatefulWidget> createState() {
    return _TapboxCState();
  }
}

class _TapboxCState extends State<TapboxC>{
  @override
  Widget build(BuildContext context) {
    return  GestureDetector(
      onTap: ()=>widget.onChanged(!widget.active),
      child: Container(
        child: Text(widget.active ? "active" : "inactivie"),
        decoration: BoxDecoration(
            color: widget.active ? Colors.lightBlue[700] : Colors.yellow[600]),
      ),
    );
  }

}
